<template>
  <div class="bd">
    我是父组件
    <ChildView @update-data="handleDataChange"></ChildView>
  </div>
</template>
<script setup>
import { onBeforeMount, onMounted, ref } from 'vue'
import ChildView from './ChildView.vue'

const recData = ref({})

const handleDataChange = (data) => {
  console.log('来自子组件mounted异步获取到的值')
  console.info(data)
  recData.value = data
}

const queryAsyncData = async () => {
  return new Promise((resolve) => {
    setTimeout(() => {
      resolve('new Parent Data')
    }, 700)
  })
}

onBeforeMount(() => {
  console.warn('parent onBeforeMount!')
})

const parentData = ref('init')
onMounted(async () => {
  parentData.value = await queryAsyncData()
  console.warn('parent onMounted!')
  console.warn('parent recData===>', recData.value)
})
</script>
